<!-- 创建一个新的组件文件 MessageBoxContent.vue -->
<template>
  <div style="padding: 20px; text-align: center;">
    <div style="font-size: 18px; font-weight: bold; margin-bottom: 15px; color: #303133;">
      请选择跳转页面
    </div>
    <div style="font-size: 14px; color: #606266; margin-bottom: 20px;">
      <div>案件信息：{{ caseInfo.anHao || '未知案号' }}</div>
      <div>被查询人：{{ caseInfo.executor || '未知' }}</div>
      <div>执行金额：{{ caseInfo.caseMoney || '未知' }}元</div>
    </div>
    <div style="display: flex; justify-content: center; gap: 20px; margin-top: 10px;">
      <div style="text-align: center; padding: 10px; border-radius: 8px; background-color: #f0f9eb; border: 1px solid #e1f3d8; width: 120px;">
        <div style="font-weight: bold; color: #67c23a;">鱼骨图分析</div>
        <div style="font-size: 12px; color: #909399; margin-top: 5px;">个人信息可视化分析</div>
      </div>
      <div style="text-align: center; padding: 10px; border-radius: 8px; background-color: #f0f2f5; border: 1px solid #dcdfe6; width: 120px;">
        <div style="font-weight: bold; color: #409eff;">数据汇总</div>
        <div style="font-size: 12px; color: #909399; margin-top: 5px;">综合信息摘要展示</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'MessageBoxContent',
  props: {
    caseInfo: {
      type: Object,
      required: true
    }
  }
}
</script>
